
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
        <title>评价</title>
        <link rel="stylesheet" href="__PUBLIC__/message/css/new_file.css" type="text/css"/>
        <script type="text/javascript" src="__PUBLIC__/message/js/jquery-1.8.2.min.js" ></script>
        <style type="text/css">
            .food {
                margin-top: 10px;
                width: 100%;
                height: auto;
                overflow: hidden;
            }
            .food ul li {
                margin-bottom: 10px;
                border-bottom: 1px solid #CCC;
                height: auto;
                overflow: hidden;
                padding-bottom: 10px;
            }
            .food ul li img {
                display: block;
                padding: 5px;
                border: 1px solid #efefef;
                float: left;
                margin-right: 10px;
            }
            .food ul li p {
                float: left;
            }
            .food ul li p span {
                display: block;
                height: 30px;
                line-height: 30px;
            }
            .clear{
                clear: both;
            }
            .inputa {
                margin-top: 5px;
                border: 1px solid #EFEFEF;
                height: 30px;
                line-height: 30px;
                width: 98%;
                text-indent: 5px;
            }
        </style>
    </head>
    
    <body>
        <!--头部  star-->
        <header>
            <a href="javascript:history.go(-1);">
                <div class="_left"><img src="__PUBLIC__/message/images/left.png"></div>
                   评价
            </a>
        </header>
        <!--头部 end-->
        <form action="{:U('store')}" method="post" id="form-message">
            <input type="hidden" name="order_id" value="{$order.order_id}">
        <!--内容 star-->
        <div class="contaniner fixed-cont">
            <!--1-->
            <section class="assess">
                <p>
                    <textarea rows="7" name="content" placeholder="客官，吃的爽不爽说两句吧～～"></textarea>
                </p>
                <ul>
                    <li>评价</li>
                    <li class="assess-right">
                        <div><input type="radio" name="fenshu" checked value="3"/><img src="__PUBLIC__/message/images/hua.png"/></div>
                        <div><input type="radio" name="fenshu" value="2"/><img src="__PUBLIC__/message/images/huah.png"/></div>
                        <div><input type="radio" name="fenshu" value="1"/><img src="__PUBLIC__/message/images/huae.png"</div>
                    </li>
                </ul>
            </section>
            <!--2-->
            <section class="main">
            <div class="main-wrap">
                <span class="revtit">服务评论:</span>
                <div id="mydiv1" currentIndex="0" class="mydiv">
                    <ul class="star_ul">
                        <li num="1" onclick="fuwu(this, 1)"><img src="__PUBLIC__/message/images/star_empty.png" class="xing_hui"/></li>
                        <li num="2" onclick="fuwu(this, 2)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="3" onclick="fuwu(this, 3)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="4" onclick="fuwu(this, 4)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="5" onclick="fuwu(this, 5)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <input type="hidden" name="fuwu_fen" value="5">
                    </ul>
                </div>
            </div>
            
            <div class="main-wrap">
                <span class="revtit">传菜评价:</span>
                <div id="mydiv2" currentIndex="0" class="mydiv">
                    <ul class="star_ul">
                        <li num="1" onclick="chuancai(this, 1)"><img src="__PUBLIC__/message/images/star_empty.png" class="xing_hui"/></li>
                        <li num="2" onclick="chuancai(this, 2)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="3" onclick="chuancai(this, 3)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="4" onclick="chuancai(this, 4)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="5" onclick="chuancai(this, 5)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <input type="hidden" name="chuancai_fen" value="5">
                    </ul>
                </div>
            </div>
        
            <div class="main-wrap">
                <span class="revtit">菜品评价:</span>
                <div id="mydiv3" currentIndex="0" class="mydiv">
                    <ul class="star_ul">
                        <li num="1" onclick="testLayer(this, 1)"><img src="__PUBLIC__/message/images/star_empty.png" class="xing_hui"/></li>
                        <li num="2" onclick="testLayer(this, 2)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="3" onclick="testLayer(this, 3)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="4" onclick="testLayer(this, 4)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <li num="5" onclick="testLayer(this, 5)"><img src="__PUBLIC__/message/images/star_empty.png"  class="xing_hui"/></li>
                        <input type="hidden" name="caipin_fen" value="5">
                    </ul>
                </div>
                <!--我是菜谱信息-->
                <div class="food" id="food" style="display:none;">
                    <ul>
                        <foreach name="food" item="food">
                            <li>
                                <img src="__PUBLIC__/message/images/food.jpg" width="120" height="80" />
                                <p>
                                    <span>菜品名称：{$food.name}</span>
                                    <span>菜品数量：{$food.num}</span>
                                    <span>菜品价格：￥<php> echo number_format($food['price'] / 100, 2)</php></span>
                                </p>
                                <div class="clear"></div>
                                <div><input type="text" name="food_message[{$food.id}]" placeholder="请您输入对该菜的意见" class="inputa"></div>
                            </li>
                        </foreach>
                    </ul>
                </div>
                <div class="food" id="member">
                    <ul>
                        <li>
                            <img src="{$member.nick_path}" width="120" height="80" />
                            <p>
                                <span>员工姓名：{$member.nickname}</span>
                                <input type="hidden" name="member_id" value="{$member.id}">
                            </p>
                            <div class="clear"></div>
                            <div><input type="text" name="memeber_messaage" placeholder="请输入对员工的评价" class="inputa"></div>
                        </li>

                    </ul>
                </div>
            </div>
    </section>
        </div>

        <!--内容 end-->
        
        <!--底部 star-->
        <footer class="assess-footer fixed-footer ">
            <ul>
                <li style="display:none;">
                    <input type="checkbox" id="ass" />
                    <label for="ass" onselectstart="return false">匿名评价</label>
                </li>
                <input type="button" value="发表评论" id="btn" />
            </ul>
        </footer>
        </form>
       <!--底部  end-->
        <script type="text/javascript">
                $(".assess-footer ul li label").on('touchstart',function(){
            if($(this).hasClass('assd')){
                $(".assess-footer ul li label").removeClass("assd")
            }else{
                $(".assess-footer ul li label").addClass("assd")
            };
        });
            
//匿名评价
        var isclick = false;
        function change(mydivid,num) {
            if (!isclick) {
                var tds = $("#"+mydivid+" ul li");
                for (var i = 0; i < num; i++) {
                    var td = tds[i];
                    $(td).find("img").attr("src","__PUBLIC__/message/images\/star_full.png");
                }
                var tindex = $("#"+mydivid).attr("currentIndex");
                tindex = tindex==0?0:tindex+1;
                for (var j = num; j < tindex; j++) {
                    var td = tds[j];
                    $(td).find("img").attr("src","__PUBLIC__/message/images\/star_empty.png");
                }
                $("#"+mydivid).attr("currentIndex",num);
            }
        }
        function repeal(mydivid,num) {
            if (!isclick) {
                var tds = $("#"+mydivid+" ul li");
                var tindex = $("#"+mydivid).attr("currentIndex");
                tindex = tindex==0?0:tindex+1;
                for (var i = tindex; i < num; i++) {
                    var td = tds[i];
                    $(td).find("img").attr("src","__PUBLIC__/message/images\/star_empty.png");
                }
                $("#"+mydivid).attr("currentIndex",num);
            }
        }
        function change1(mydivid,num) {
            if (!isclick) {
                change(mydivid,num);

            }
            else {
                alert("Sorry,You had clicked me!");
            }
        }
        $(function(){
            initEvent('mydiv1');
            initEvent('mydiv2');
            initEvent('mydiv3');
        });
        function initEvent(mydivid) {
            var tds = $("#"+mydivid+" ul li");
            for (var i = 0; i < tds.length; i++) {
                var td = tds[i];
                $(td).live('mouseover',function(){var num = $(this).attr("num");change(mydivid,num);});
                $(td).live('click',function(){var num = $(this).attr("num");change1(mydivid,num);});
            }
        }

        /**
         * 检测是几星是否要弹出菜品
         */
        function testLayer(obj, num) {
            $('input[name=caipin_fen]').val(num);
            if (num <= 3) {
                $('#food').slideDown(800).css('display', 'block');
            } else {
                $("#food").css('display', 'none');
            }
        }
        function fuwu(obj, num) {
            $('input[name=fuwu_fen]').val(num);
        }
        function chuancai(obj, num) {
            $('input[name=chuancai_fen]').val(num);
        }
        $('#btn').click(function () {
            var content = $("textarea[name=content]").val();
            if (content == '') {
                alert('请输入评论');
                return false;
            }
            $('#form-message').submit();
        })
        </script>
    </body>

</html>